$(function () {
    load();

    $("#title").on("keydown", function (e) {
        if (e.keyCode === 13) {
            if ($(this).val() === '') {
                alert('请输入您要执行的操作');
            } else {
                //读取数据
                var local = getData();
                //存储数据
                local.push({ title: $(this).val(), done: false });
                saveData(local);
                $(this).val('');
                load();
            }
        }
    });

    //点击a时，删除该li
    $("ol, ul").on("click", "a", function () {
        var index = $(this).attr("id");
        var data = getData();
        data.splice(index, 1);
        saveData(data);
        load();
    });

    //点击复选框
    $("ol, ul").on("click", "input", function () {
        var index = $(this).siblings("a").attr("id");
        var data = getData();
        data[index].done = $(this).prop("checked");
        saveData(data);
        
        
        load();
    });

    //读取数据
    function getData() {
        var data = localStorage.getItem("todolist");
        if (data !== null) {
            return JSON.parse(data);
        } else {
            return [];
        }
    };
    //存储数据
    function saveData(data) {
        localStorage.setItem("todolist", JSON.stringify(data));
    };
    //渲染页面
    function load() {
        var data = getData();
        $("ol, ul").empty();
        var todoCount = 0;
        var doneCount = 0;
        $.each(data, function (i, e) {
            if (e.done) {
                $("ul").prepend("<li><input type='checkbox' checked='checked'> <p>" + e.title + "</p> <a href='javaScript:;' id='" + i + "'></a></li>");
                doneCount++;
            } else {
                $("ol").prepend("<li><input type='checkbox'> <p>" + e.title + "</p> <a href='javaScript:;' id='" + i + "'></a></li>");
                todoCount++;
            }
        });
        $("#todocount").text(todoCount);
        $("#donecount").text(doneCount);
    };

})